<div class="goodsmanager">
	<div class="nav">
		<div class="nav-li focus">商品管理</div>
	</div>
	<hr />

	<div class="goods_list">
		{{#if $Cache.bus.goodsmanager.card_factory_list.length}}
			<div class="card-facotry-list">
				<span class="card-facotry-item">
					<a href="#admin/goodsmanager">公开的商品</a>
				</span>
				{{#each $Cache.bus.goodsmanager.card_factory_list}}
					<span class="card-facotry-item" title="{{info.intro}}">
						<a href="#admin/goodsmanager?card_factory_id={{_id}}">{{info.name}}</a>
					</span>
				{{/each}}
			</div>
		{{/if}}
		<div>空间：{{$Cache.bus.goods.page_info.total_num}}/{{bus_info.permission.data_max_goods_num||config.server_config.defaultMaxGoodsNum}}</div>
		<table>
			<thead>
				<td class="logo">缩略图</td>
				<td class="name">名称</td>
				<td class="number">编号</td>
				<td class="price">价格</td>
				<td class="method">操作</td>
			</thead>
			{{#each goods}}
			<tr class="{{_is_draging?'dragging ':' '}}{{_dragenter_status}}{{is_un_sold?' un_sold_goods':''}}" 
				event-dragover="{{'$Top.$Event.goodsmanager.dragover'}}"
				event-dragleave="{{'$Top.$Event.goodsmanager.dragleave'}}"
				event-dragenter="{{'$Top.$Event.goodsmanager.dragenter'}}">
				<td><img bind-src="{{preview_img_url}}?imageView/1/w/25/h/25" alt="{{goods_name}}的缩略图"></td>
				<td><a href="{{$Top.bus_loginer.url}}/goods-details.html?id={{_id}}">{{goods_name}}</a></td>
				<td>{{_id}}</td>
				<td>{{price}}</td>
				<td>
					<button event-click="{{'$Top.$Event.remove_goods'}}" class="delete"><android:icon type="action-delete" style="font-size: 1em;transform: scale(1.3);"></android:icon>删除</button>
					<button event-click="{{'$Top.$Event.update_goods'}}" class="delete"><android:icon type="image-edit" style="font-size: 1em;transform: scale(1.3);"></android:icon>修改</button>
					<button title="置顶" event-click="{{'$Top.$Event.to_top'}}"><android:icon type="editor-vertical-align-top" style="font-size: 1em;transform: scale(1.3);"></android:icon>置顶</button>
					<!-- <button title="上移" event-click="{{'$Top.$Event.to_up'}}" class="icon-arrow-up"></button>
					<button title="下移" event-click="{{'$Top.$Event.to_down'}}" class="icon-arrow-down"></button> -->
					<button title="拖动排序" draggable
						event-dragstart="{{'$Top.$Event.goodsmanager.dragstart'}}" 
						event-dragend="{{'$Top.$Event.goodsmanager.dragend'}}" 
					><android:icon type="action-swap-vert" style="font-size: 1em;transform: scale(1.5);"></android:icon></button>
					{{#if is_un_sold}}
					<button event-click="{{'$Top.$Event.goodsmanager.remove_goods_from_un_sold_goods'}}"><android:icon type="action-lock-open" style="font-size: 1em;transform: scale(1.5);"></android:icon>上架</button>
					{{#else}}
					<button event-click="{{'$Top.$Event.goodsmanager.add_goods_to_un_sold_goods'}}"><android:icon type="action-lock" style="font-size: 1em;transform: scale(1.5);"></android:icon>下架</button>
					{{/if}}
				</td>
			</tr>
			{{/each}}
		</table>

		<pagination
		 id="turn-page"
		 page-info="$Cache.bus.goods.page_info"
		 ></pagination>
	</div>
	
</div>
<style>
	.dragging{
		position:relative;
		opacity:0.4;
	}
	.dragenter-status-before{
		background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.35) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.35))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* IE10+ */
		background: linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.35) 100%); /* W3C */
		-webkit-box-shadow: 0px 3px 10px #000000!important;
		-moz-box-shadow: 0px 3px 10px #000000!important;
		box-shadow: 0px 3px 10px #000000!important;
		-webkit-transform: perspective(500px) rotateX(-30deg)!important;
		-moz-transform: perspective(500px) rotateX(-30deg)!important;
		-o-transform: perspective(500px) rotateX(-30deg)!important;
		-ms-transform: perspective(500px) rotateX(-30deg)!important;
		transform: perspective(500px) rotateX(-30deg)!important;
	}
	.dragenter-status-after{
		background: -moz-linear-gradient(top, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.35)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
		background: linear-gradient(top, rgba(0,0,0,0.35) 0%,rgba(0,0,0,0) 100%); /* W3C */
		-webkit-transform: perspective(500px) rotateX(30deg)!important;
		-moz-transform: perspective(500px) rotateX(30deg)!important;
		-o-transform: perspective(500px) rotateX(30deg)!important;
		-ms-transform: perspective(500px) rotateX(30deg)!important;
		transform: perspective(500px) rotateX(30deg)!important;
	}
	.un_sold_goods *{
		background: #FFB5B5!important;
	}
</style>